<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <!--Extjs version 6.2.0 -->
    <link href="css/theme-classic-all.css" rel="stylesheet" />
    <script type="text/javascript" src="locale/locale-zh_CN.js"></script>
    <script type="text/javascript" src="js/ext-all.js"></script>
    <script type="text/javascript">
        Ext.onReady(function() {
            new Ext.Viewport({
                title: "Viewport",
                layout: "border",
                defaults: {
                    bodyStyle: "background-color: #FFFFFF;",
                    frame: true
                },
                items: [{
                        region: "west",
                        width: 90,
                        title: 'north',
                        collapsible: true
                    }, {
                        region: "east",
                        width: 90,
                        title: 'north',
                        collapsible: true
                    }, {
                        region: "north",
                        height: 100,
                        title: 'north',
                        collapsible: true
                    }, {
                        region: "center",
                        split: true,
                        border: true,
                        collapsible: true,
                        title: 'center'
                    }, {
                        region: "south",
                        title: "south",
                        split: true,
                        border: true,
                        collapsible: true,
                        height: 100
                    },

                ]
            });
        });
    </script>
</head>

<body>

</body>

</html>